.category {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;

  .search {
    height: 88rpx;
    // width: 100%;
    padding: 0 30rpx;
    background: #fff;
    display: flex;
    align-items: center;
    border-bottom: 1rpx solid #ededed;

    .ser {
      width: 690rpx;
      height: 56rpx;
      background: #ededed;
      border-radius: 8rpx;
      display: flex;
      align-items: center;
      justify-content: center;

      span {
        display: inline-block;
      }

      .icon {
        background: url('http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/search2-2fb94833aa.png') center no-repeat;
        background-size: 100%;
        width: 28rpx;
        height: 28rpx;
        margin-right: 10rpx;
      }
    }
  }

  .content {
    flex: 1;
    background: #fff;
    display: flex;

    .left {
      width: 162rpx;
      height: 100%;
      text-align: center;

      .iconText {
        text-align: center;
        line-height: 90rpx;
        width: 162rpx;
        height: 90rpx;
        color: #333;
        font-size: 28rpx;
        border-left: 6rpx solid #fff;
      }

      .active {
        color: #ab2b2b;
        font-size: 36rpx;
        border-left: 6rpx solid #ab2b2b;
      }
    }

    .right {
      flex: 1;
      border-left: 1rpx solid #fafafa;
      flex: 1;
      height: 100%;
      padding: 0 30rpx 0 30rpx;

      .banner {
        width: 100%;
        height: 222rpx;
        margin-top: 20rpx;

        img {
          width: 100%;
          height: 100%;
        }
      }
      .cateItem{
       

        .title {
          text-align: center;
          padding: 50rpx 0;

          span:nth-child(2) {
            font-size: 24rpx;
            color: #333;
            padding: 0 10rpx;
          }

          span:nth-child(2n + 1) {
            color: #999;
          }
        }

        .bottom {
          display: flex; // justify-content: space-between;
          flex-wrap: wrap;
          

          .item {
            width: 100%;
             height: 144px;
            text-align: center;
            margin-bottom: 30px;
            // border: 1px solid #ccc;
            border-radius: 10px;
              

            img {
              height:100%;
              width: 100%;
              display: block;
              margin: 0 auto;
              border-radius: 10px;
            }
          }
        }
    }
    }
  }
}
